/*
* @Author: jason
* @Date:   2017-04-08 21:08:57
* @Last Modified by:   jason
* @Last Modified time: 2017-06-21 11:43:00
*/
@charset "utf-8";

/********************
common
********************/
/* reset */
*,
*:before,
*:after {
  -webkit-transition: all .5s;
          transition: all .5s;
}
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, pre, form, fieldset, legend, textarea {
  margin: 0;
  padding: 0;
}
body {
  font: 12px/24px 'Microsoft YaHei', Arial, Helvetica, sans-serif;
  overflow-x: hidden;
  -webkit-transition: none;
          transition: none;
}
body, a { color: #666; }
a { text-decoration: none; }
a:hover {
  color: #0a82cb;
  text-decoration: none;
}
input, select, button, textarea {
  font-size: 100%;
  font-family: inherit;
  outline: none;
}
ul, ol { list-style: none; }
img { border: 0; }
table {
  border-collapse: collapse;
  border-spacing: 0;
}
small, .small { font-size: 12px; }
big, .big { font-size: 18px; }
:focus { outline: 0; }
.clearfix:after, .w:after {
  clear: both;
  height: 0;
  display: block;
  content: '';
}
.clearfix, .w { zoom: 1; }
.clear {
  clear: both;
  height: 0;
  font-size: 0;
  overflow: hidden;
}

/* float */
.fl { float: left; }
.fr { float: right; }

/* text-align */
.tl { text-align: left; }
.tc { text-align: center; }
.tr { text-align: right; }

/* display */
.hide { display: none; }
.hidden { overflow: hidden; }

/* relative */
.relative { position: relative; }

/* no-trans */
.no-trans {
  -webkit-transition: none;
          transition: none;
}

/* width */
.w {
  width: 1180px;
  margin: 0 auto;
}

/* margin */
.mt20 { margin-top: 20px; }
.mt30 { margin-top: 30px; }
.mt50 { margin-top: 50px; }
.mtb50 {
  margin-top: 50px;
  margin-bottom: 50px;
}

/* img */
/* img-main */
img.img-main,
.img-main img {
  display: block;
  background: #ccc;
}
/* img-load */
.img-load .image {
  display: block;
  overflow: hidden;
  background-color: #ccc;
}
.img-load .image img { display: block; }
/* img-zoom */
.img-zoom .image:hover img {
  -webkit-transform: scale(1.2);
          transform: scale(1.2);
}
/* img-opacity */
.img-opacity .image:hover img {
  opacity: .5;
  filter: alpha(opacity=50);
}

/* color */
.color-blue,
.color-blue a { color: #0a82cb; }
.color-blue a:hover,
a.color-blue:hover { color: #f59503; }

.color-orange,
.color-orange a { color: #f59503; }

.color-black,
.color-black a { color: #333; }
.color-black a:hover,
a.color-black:hover { color: #0a82cb; }

/* css3 */
@-webkit-keyframes rotate {
  from { -webkit-transform: rotate(0); }
  to   { -webkit-transform: rotate(360deg); }
}
@keyframes rotate {
  from {  transform: rotate(0); }
  to   { transform: rotate(360deg); }
}


/********************
header
********************/
.header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  width: 100%;
  background-color: #fff;
}
/* toolbar */
.header .toolbar {
  height: 35px;
  overflow: hidden;
  border-bottom: 1px solid #e5e5e5;
}
.header .toolbar a { display: inline-block; }
.header .toolbar i {
  position: absolute;
  top: 50%;
  left: 0;
  display: block;
  width: 18px;
  height: 18px;
  margin-top: -9px;
  background: url('../images/toolbar_icon.png') no-repeat;
}

/* welcome */
.header .welcome {
  position: relative;
  float: left;
  padding-left: 18px;
  line-height: 35px;
}
.header .welcome i { background-position: 0 0; }

/* links */
.header .links {
  float: right;
  margin-top: 11px;
  margin-left: 30px;
  line-height: 1;
}
.header .links li {
  float: left;
  margin-right: 10px;
  padding-right: 10px;
  border-right: 1px solid #e0e0e0;
}
.header .links li.last {
  margin: 0;
  padding: 0;
  border: none;
}
.header .links a:hover { color: #f59503; }

/* contact */
.header .contact {
  float: right;
  line-height: 35px;
}
.header .contact .qq {
  position: relative;
  margin-right: 10px;
  padding-left: 22px;
  font-weight: bold;
}
.header .contact .qq i { background-position: -18px 0; }
.header .contact .tel {
  position: relative;
  margin-left: 10px;
  padding-left: 22px;
  font-size: 18px;
  font-weight: bold;
  font-family: Arial;
  font-style: italic;
}
.header .contact .tel i { background-position: -36px 0; }
.header .contact .tel:hover i { background-position: -36px -28px; }

/* main */
.header .main {
  position: relative;
  z-index: 2;
  height: 80px;
}

/* logo */
.header .logo {
  float: left;
  width: 200px;
  height: 50px;
  margin-top: 15px;
  text-indent: -999em;
  background: url('../images/logo.png') left center no-repeat;
  -webkit-background-size: auto 100%;
          background-size: auto 100%;
}
.header .logo a {
  display: block;
  width: 100%;
  height: 100%;
}

/* menu */
.header .menu {
  position: relative;
  float: right;
/*  width: 648px;*/
  margin-right: 100px;
}
.header .menu ul {
  position: relative;
  z-index: 2;
}
.header .menu ul li {
  position: relative;
  float: left;
  width: 108px;
  padding: 20px 0;
}
.header .menu ul li a {
  display: block;
  height: 40px;
  font-size: 15px;
  line-height: 40px;
  color: #333;
  text-align: center;
  overflow: hidden;
}
.header .menu ul li.menu-on > a { color: #fff; }
.header .menu ul li ul {
  position: absolute;
  top: 80px;
  left: 0;
  display: none;
  width: 200px;
  padding: 10px 0 20px;
  background-color: #0a82cb;
  background-color: rgba(10, 130, 203, .7);
  -webkit-transition: none;
          transition: none;
}
.header .menu ul li ul li {
  position: relative;
  width: 180px;
  padding: 0 10px;
}
.header .menu ul li ul li a {
  height: 35px;
  padding: 0 14px;
  font-size: 13px;
  line-height: 35px;
  color: #fff;
  text-align: left;
  border-bottom: 1px dotted #fff;
  background: url('../images/menu_sub_icon.png') no-repeat 2px top;
}
.header .menu ul li ul li:hover > a {
  color: #7beeff;
  background-position: 2px bottom;
}
.header .menu ul li ul li.has { background: url('../images/menu_sub_arrow.png') no-repeat right top; }
.header .menu ul li ul li.has:hover { background-position: right bottom; }
.header .menu ul li ul li ul {
  position: absolute;
  top: -10px;
  left: 200px;
}
.header .menu-bg {
  position: absolute;
  top: 20px;
  left: 0;
  z-index: 1;
  display: none;
  width: 108px;
  height: 40px;
  border-radius: 40px;
  background-color: #0a82cb;
}

/* search */
.header .search {
  position: absolute;
  top: 0;
  right: 0;
  width: 40px;
  height: 40px;
  padding: 20px 0;
}
.header .search button {
  width: 40px;
  height: 40px;
  cursor: pointer;
  border: none;
  border-radius: 50%;
  background: url('../images/search_icon.png') no-repeat center top #75b7e4;
}
.header .search:hover button {
  background-position: center bottom;
  background-color: #0a82cb;
}
.header .search .box {
  position: absolute;
  top: 80px;
  right: 0;
  display: none;
}
.header .search .text {
  width: 180px;
  height: 33px;
  padding: 0 10px;
  line-height: 33px;
  color: #75b7e4;
  text-align: center;
  border: 5px solid #75b7e4;
}

.top-box { height: 116px; }

.header-fixed {
  -webkit-box-shadow: 0 1px 4px #999;
          box-shadow: 0 1px 4px #999;
}
.header-fixed .toolbar { height: 0; }
.header-fixed .main { height: 60px; }
.header-fixed .logo {
  width: 160px;
  height: 40px;
  margin-top: 10px;
}
.header-fixed .menu ul li,
.header-fixed .search { padding: 10px 0; }
.header-fixed .menu ul li ul,
.header-fixed .search .box { top: 60px; }
.header-fixed .menu-bg { top: 10px; }

/********************
footer
********************/
/* main */
.footer .main { background-color: #2d3237; }
.footer .main,
.footer .main a { color: #aaa; }
.footer .main a:hover { color: #fff; }
.footer .main .body {
  padding: 40px 0;
  border-bottom: 1px solid #25282b;
}
.footer .main .contact {
  float: left;
  width: 230px;
  padding-right: 60px;
}
.footer .main .contact .tel {
  height: 43px;
  padding-left: 50px;
  background: url('../images/footer_contact_icon.png') no-repeat left;
}
.footer .main .contact .tel p {
  margin-bottom: 2px;
  line-height: 18px;
}
.footer .main .contact .tel b {
  font-size: 24px;
  font-family: Times New Roman, Arial;
  line-height: 1;
  color: #fff;
}
.footer .main .contact .info { margin-top: 5px; }
.footer .main .contact .service { margin-top: 15px; }
.footer .main .contact .service a {
  position: relative;
  float: left;
  width: 30px;
  height: 30px;
  margin: 0 10px 0 0;
  padding: 0;
  border-radius: 100%;
  background: url('../images/footer_service_icon.png') no-repeat #aaa;
}
.footer .main .contact .service a:hover { background-color: #b1d1e8; }
.footer .main .contact .service a.sqq { background-position: left top; }
.footer .main .contact .service a.tsina { background-position: center top; }
.footer .main .contact .service a.weixin { background-position: right top; }
.footer .main .contact .service a.sqq:hover { background-position: left bottom; }
.footer .main .contact .service a.tsina:hover { background-position: center bottom; }
.footer .main .contact .service a.weixin:hover { background-position: right bottom; }
.footer .main .contact .service a.weixin img {
  position: absolute;
  top: 0;
  left: 30px;
  display: none;
  width: 110px;
  z-index: 10;
}
.footer .main .contact .service a.weixin:hover img { display: block; }

.footer .main .links {
  float: left;
  width: 684px;
  min-height: 204px;
}
.footer .main .links li {
  float: left;
  width: 170px;
  border-left: 1px solid #363f48;
}
.footer .main .links li h3 {
  overflow: hidden;
  height: 21px;
  margin-bottom: 10px;
  margin-left: -1px;
  padding-left: 10px;
  padding-right: 20px;
  font-size: 15px;
  font-weight: normal;
  color: #fff;
  line-height: 18px;
  border-left: 1px solid #75b7e4;
}
.footer .main .links li p {
  height: 24px;
  padding-left: 10px;
  padding-right: 20px;
  overflow: hidden;
}
.footer .main .qrcode {
  float: right;
  width: 110px;
  padding: 20px;
  border: 1px solid #363f48;
  border-radius: 2px;
}
.footer .main .qrcode .image,
.footer .main .qrcode .image img {
  width: 110px;
  height: 110px;
}
.footer .main .qrcode p {
  margin-top: 15px;
  line-height: 1;
  text-align: center;
}

/* bottom */
.footer .bottom {
  position: relative;
  overflow: hidden;
  padding: 10px 0;
  border-top: 1px solid #363f48;
}
.footer .bottom .flink {
  position: relative;
  padding: 2px 200px 2px 65px;
  line-height: 22px;
}
.footer .bottom .flink span {
  position: absolute;
  top: 2px;
  left: 0;
  color: #fff;
}
.footer .bottom .flink i {
  margin: 0 8px;
  font-family: Arial;
  font-style: normal;
}
.footer .bottom .share {
  position: absolute;
  top: 10px;
  right: 0;
  height: 26px;
}

/* copyright */
.footer .copyright {
  overflow: hidden;
  padding: 10px 0;
  background-color: #23282d;
}
.footer .copyright i {
  margin: 0 8px;
  font-family: Arial;
  font-style: normal;
}
.footer .copyright a:hover { color: #fff; }

/* online */
.online {
  position: absolute;
  top: 250px;
  right: 0;
  z-index: 10;
  width: 55px;
  height: 205px;
}
.online li {
  position: absolute;
  right: 0;
  width: 55px;
  height: 50px;
  overflow: hidden;
  margin-bottom: 1px;
  font-size: 14px;
  line-height: 50px;
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
  background-color: #3e3e3e;
}
.online li a {
  position: relative;
  display: block;
  width: 100px;
  height: 50px;
  padding-left: 55px;
  color: #fff;
}
.online li a:before {
  position: absolute;
  top: 0;
  left: 0;
  width: 55px;
  height: 100%;
  content: '';
  background-image: url('../images/online_icon.png');
  background-repeat: no-repeat;
}
.online li:hover {
  width: 155px;
  background-color: #0a82cb;
}
.online li.weixin:hover { height: 185px; }
.online .top { top: 0; }
.online .qq { top: 51px; }
.online .tel { top: 102px; }
.online .weixin { top: 153px; }
.online .top a:before { background-position: 0 0 }
.online .qq a:before { background-position: -55px 0; }
.online .tel a:before { background-position: -110px 0; }
.online .weixin a:before { background-position: -165px 0; }
.online .weixin .box {
  display: block;
  width: 115px;
  height: 115px;
  margin: auto;
  padding: 0 20px;
}
.online .weixin img {
  display: block;
  width: 115px;
  height: 115px;
}